import React, { createContext, useEffect, useState } from "react";
import useAuthButtons from "@/hooks/useAuthButtons";

import TableData from "./TableData";
import SearchForm from "./SearchForm";
import { Params, RecordItem, SearchParam } from "./type";
import request from "@/utils/request";

export const Context = createContext({});

const TenantManage = () => {
	const [data, setData] = useState<RecordItem[]>([]);
	const [total, setTotal] = useState(0);

	const [filterData, setFilterData] = useState<Params>({
		page: 1,
		pageSize: 8
	});

	useEffect(() => {
		doSearch({});
	}, []);

	const doSearch = (params: object) => {
		const data = { ...filterData, ...params };
		request('tenantManageEntityList', { data }).then(res => {
			if (res?.code === 0) {
				setFilterData(data);
				setData(res.data.list || []);
				setTotal(res.data.total);
			}
		})

	};

	const handlePageChange = (page: number, pageSize?: number) => {
		doSearch({ page, pageSize: pageSize || 8 });
	};

	const handleSearch = (searchParam: SearchParam) => {
		doSearch({ ...searchParam, page: 1 });
	};

	// 按钮权限
	const { BUTTONS } = useAuthButtons();
	// console.log(BUTTONS.add);

	return (
		<div className="card content-box">
			<Context.Provider value={{}}>
				<SearchForm doSearch={handleSearch} />
				<TableData
					filterData={filterData}
					data={data}
					page={filterData.page}
					doSearch={doSearch}
					pageSize={filterData.pageSize}
					onPageChange={handlePageChange}
					total={total}
				></TableData>
			</Context.Provider>
		</div>
	);
};

export default TenantManage;
